<script lang="ts" setup>
import BaseButton from "@/components/BaseButton/index.vue";
import BaseUpDown from "@/components/BaseUpDown/index.vue";
import useSearch from "@/hooks/useSearch";
import useData from "./hooks/useData";
import EditNetwork from "./components/EditNetwork/index.vue";

const { pageData } = useData();
import { deleteData, getDataByPage, ifaceLinkUpdate } from "@/api/modules/dynamic-camouflage/line-config";
import UpdateForm from "./components/UpdateForm/index.vue";

const { tableData, loadData, formData } = useSearch({
  defaultData: {},
  responseKey: {
    list: "data.results",
    total: "data.count"
  }
});

async function loadDataCb() {
  const res = await getDataByPage({
    page: formData.pageNum,
    page_size: formData.pageSize
  });
  tableData.list = res;
  tableData.total = res.length;
}

loadDataCb();

/**删除*/
import useDelete from "@/hooks/useDelete";
import BaseCollapse from "@/components/BaseCollapse/index.vue";

const { deleteHandler, idList } = useDelete();

async function deleteCb(data) {
  await deleteHandler({
    api: ifaceLinkUpdate,
    multiple: false,
    sendData: {
      action: "delete",
      type: String(modeMap.get(data.row.linkmode)),
      link: data.row.linkid,
      lan: getLanText(data.row.ifname),
      wan: getWanText(data.row.ifname) ? getWanText(data.row.ifname) : undefined
    },
    hideMessageBox: false
  });
  loadDataCb();
}

function selectCb(data) {
  console.log(data);
  idList.value = data.rowList.map(item => item.userId);
}

function getLanText(data) {
  console.log(data);
  if (!data) {
    return "";
  }
  let text = "";
  if (data.includes("-")) {
    let arr = data.split("-");
    let arrOne = arr[0];
    arrOne = arrOne.split(":");
    text = arrOne[1];
  } else {
    let arrOne = data.split(":");
    text = arrOne[1];
  }
  return text;
}

function getWanText(data) {
  console.log(data);
  if (!data) {
    return "";
  }
  let arr = data.split("-");
  let text = arr[1];
  return text;
}

function getLanMacText(data) {
  console.log(data);
  if (!data) {
    return "";
  }
  let text = data;
  if (data.includes("-")) {
    let arr = data.split("-");
    text = arr[0];
  }
  return text;
}

function getWanMacText(data) {
  console.log(data);
  if (!data) {
    return "";
  }
  let text = data;
  if (data.includes("-")) {
    let arr = data.split("-");
    text = arr[1];
  }
  return text;
}

const modeMap = new Map([
  ["旁路模式", 1],
  ["串联模式", 2],
  ["动态网络", 3]
]);
const modeTextMap = new Map([
  ["旁路模式", "旁路"],
  ["串联模式", "串联直通"],
  ["动态网络", "串联网关"]
]);
</script>

<template>
  <BaseUpDown>
    <template #up>
      <div class="h-box justify-end mg-b-sm">
        <UpdateForm
          :total="tableData.list?.length ? tableData.list[tableData.list?.length - 1]?.linkid : 0"
          @success="loadDataCb()"
        >
          <BaseButton type="add_icon_text" />
        </UpdateForm>
        <BaseButton @click="loadDataCb" type="refresh_icon_text" />
      </div>
    </template>
    <he-table
      @handle-current-change="loadDataCb"
      :total="tableData.total"
      v-model:page-size="formData.pageSize"
      v-model:page-num="formData.pageNum"
      operate-width="180px"
      :operate-list="[]"
      :table-data="tableData.list"
      :column-data="pageData.columnData"
      :show-multiple="false"
      :show-summary="false"
      :show-operate="false"
      :show-multiple-column="false"
      :show-pagination="false"
      @select="selectCb"
    >
      <template #operationDefault="{ data }">
        <UpdateForm
          v-if="false"
          :row-data="{
            ...data.row,
            id: 'edit'
          }"
          :title="`编辑线路`"
          @success="loadDataCb"
        >
          <base-button type="edit_text"></base-button>
        </UpdateForm>
        <EditNetwork
          @success="loadDataCb"
          v-if="data.row.linkmode == '动态网络'"
          :row-data="{
            ifid: data.row.ifid,
            wan: getWanText(data.row.ifname)
          }"
        >
          <base-button type="config_icon_text"></base-button>
        </EditNetwork>

        <base-button @click="deleteCb(data)" type="del_text"></base-button>
      </template>
      <template #indexDefault="{ data }">
        {{ data.$index + 1 }}
      </template>
      <template #linkmodeDefault="{ data }">
        {{ modeTextMap.get(data.row.linkmode) }}
      </template>
      <template #linkidDefault="{ data }"> 线路{{ data.row.linkid }}</template>
      <template #lanDefault="{ data }"> {{ getLanText(data.row.ifname) }}</template>
      <template #wanDefault="{ data }"> {{ getWanText(data.row.ifname) }}</template>
      <template #lan_macDefault="{ data }"> {{ getLanMacText(data.row.mac) }}</template>
      <template #wan_macDefault="{ data }"> {{ getWanMacText(data.row.mac) }}</template>
    </he-table>
  </BaseUpDown>
</template>
